<script lang="ts" setup>
import { useVbenModal } from '@vben/common-ui'
import { $t } from '@vben/locales'
import { computed, ref } from 'vue'
import PageContent from './components/PageContent.vue'

const title = ref('')

let api: (...args: any[]) => Promise<any>

const isOpen = ref(false)

const [Modal, modalApi] = useVbenModal({
    onConfirm: async () => {
        if (api) {
            modalApi.setState({
                confirmLoading: true
            })
            try {
                const res = await api()
                if (res) {
                    modalApi.close()
                }
            } finally {
                modalApi.setState({
                    confirmLoading: false
                })
            }
        }
    },
    onOpenChange(val: boolean) {
        isOpen.value = val
        if (!val) return
        const data = modalApi.getData<Record<string, any>>() || {}

        if (data.api) {
            api = data.api
        }

        title.value = data.title || ''
    },
    title: computed(() => {
        return $t(title.value || 'common.importRecord')
    }),
    class: 'w-[1000px] '
})
</script>

<template>
    <Modal>
        <PageContent page-height="600px" :api="api" />
    </Modal>
</template>
